<template>
    <div>
        <Form class="clearfix padding-right-15" :label-width="160" ref="form" :rules="rules" :model="formData">
            <FormItem label="服务代码名称" prop="carrierGroupCode">
                <Input v-model="formData.carrierGroupCode" placeholder="请输入代码加数字"></Input>
            </FormItem>
            <FormItem label="国别" prop="regionId">
                <Select v-model="formData.regionId">
                    <Option v-for="item in getCountryList" :key="item.attach.id" :value="item.attach.id" >{{ item.label }}</Option>
                </Select>
            </FormItem>
        </Form>
        <div class="margin-top-10 margin-bottom-10 text-right">
            <Button class="margin-right-20" type="primary" @click="addService">确定</Button>
            <Button class="margin-right-20" @click="cancel">取消</Button>
        </div>
    </div>
</template>

<script>
import { HttpCarrierProductSave } from '@/service/api/views';
import { mapGetters } from "vuex";

export default {
    components: {
    },
    data(){
        return {
            formData: {
                carrierGroupCode: '',
                regionId: ''
            },
            rules: {
                carrierGroupCode: [
                    {
                        required: true,
                        message: "该项不能为空，请填写",
                    },
                ],
                regionId: [
                    {
                        required: true,
                        message: "该项不能为空，请填写",
                    },
                ],
            },
        }
    },
	computed: {
         ...mapGetters('dictionary',['getCountryList']),
	},
    methods:{
        cancel(){
            this.formData = {
                carrierGroupCode: '',
                regionId: ''
            };
            this.$emit('on-success')
        },
        async addService(){
            let valid = await this.$refs['form'].validate();
			if (!valid) return;
			HttpCarrierProductSave({
                ...this.formData,
                organizationId: global.SYSID,
			}).then(res => {
				this.loading = false;
                this.$Message.success(res.message)
				this.cancel();
			}, err => {
				this.loading = false;
				this.$Message.error(err.message);
			})
        },
    }
}
</script>
